<ion-content>
  <ion-button id="open-alert">Open Alert</ion-button>
  <ion-button id="open-action-sheet">Open Action Sheet</ion-button>
  <ion-button id="open-loading">Open Loading</ion-button>
  <ion-button id="open-toast">Open Toast</ion-button>
  <ion-button id="open-picker">Open Picker</ion-button>

  <ion-alert
    trigger="open-alert"
    header="Alert"
    message="This is an alert."
    [buttons]="['Ok', 'Cancel']"
  >
  </ion-alert>

  <ion-action-sheet
    trigger="open-action-sheet"
    header="Action Sheet"
    [buttons]="['Button A', 'Button B']"
  >
  </ion-action-sheet>

  <ion-loading
    trigger="open-loading"
    message="This is a loading message"
    [backdropDismiss]="true"
  ></ion-loading>

  <ion-toast
    trigger="open-toast"
    message="This is a toast message"
    [buttons]="['Button']"
  ></ion-toast>

  <ion-picker
    trigger="open-picker"
    [columns]="pickerColumns"
    [buttons]="pickerButtons"
  ></ion-picker>
</ion-content>
